<template>
	<view>
		<!-- 感谢 -->
		<u-popup v-model="isShow" mode="center" border-radius="5" z-index="1000">
			<view class="sendMsg" :style="[{ height: is_money ? '450rpx' : '380rpx' }]">
				<view class="header u-flex u-row-between u-p-l-30 u-p-r-30 u-p-t-20 u-p-b-20">
					<view class="">付费查看</view>
					<u-icon name="close" @click="close"></u-icon>
				</view>
				<view class="u-p-30">
					<view class="alert-warning u-p-20" :style="[{ backgroundColor: theme.lightColor, color: theme.bgColor }]">
						{{ is_money ? '支付金额：￥' + money : '确认使用' + score + '积分?' }}
					</view>
				</view>
				<view class="u-p-l-30 u-p-r-30" v-if="is_money">
					<u-radio-group class="group" v-model="paytype">
						<view class="u-flex u-row-around group">
							<u-radio :active-color="theme.bgColor" v-for="(item, index) in paylist" :key="index" :name="item.value">{{ item.name }}</u-radio>
						</view>
					</u-radio-group>
				</view>
				<view class="u-text-center u-border-top u-m-t-30 u-p-t-30 u-p-b-30">
					<u-button
						hover-class="none"
						type="primary"
						:custom-style="{ width: '50%', height: '60rpx', backgroundColor: theme.bgColor, color: theme.color }"
						size="mini"
						@click="submit"
					>
						{{ is_money ? '立即支付' : '确定' }}
					</u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
import { login } from '@/common/fa.mixin.js';
export default {
	mixins: [login],
	name: 'fa-order-pay',
	props: {
		source_id: {
			type: [Number, String],
			default: 0
		},
		type:{
			type: String,
			default: 'article'
		},
		money: {
			type: [String,Number],
			default: '0'
		},
		score:{
			type: [String,Number],
			default: '0'
		}
	},
	computed:{
		isWeixin(){

			// #ifndef MP-WEIXIN
				return this.$util.isWeiXinBrowser();
			// #endif

			// #ifdef MP-WEIXIN
			return true;
			// #endif
		},
		is_money(){
			return Number(this.money)>0;
		},
		paylist(){
			let list = [{
				name:'余额',
				value:'balance'
			}];

			// #ifndef MP-WEIXIN || MP-BAIDU
			// if(!this.isWeixin){
			// 	list.splice(0,0,{
			// 		name:'支付宝',
			// 		value:'alipay'
			// 	})
			// }
			// #endif

			// #ifndef MP-BAIDU || MP-ALIPAY
			// list.splice(0,0,{
			// 	name:'微信',
			// 	value:'wechat'
			// });
			// #endif
			return list;
		}
	},
	data() {
		return {
			isShow: false,
			paytype: 'balance'
		};
	},
	methods: {
		show() {
			this.isShow = true;
		},
		close() {
			this.isShow = false;
		},

		// #ifdef MP-WEIXIN
			submit: async function() {
				let res = await this.$api.goOrderSubmit({
					id: this.source_id,
					type: this.type,
					paytype: this.paytype,
					method: 'miniapp',
					currency:this.is_money?'money':'score'
				});
				if(res.data=='bind'){
					this.$wanlshop.to('/pages/community/login/wxlogin');
					return;
				}
				if(!res.code){
					this.$u.toast(res.msg);
					return;
				 }				
				if ('balance' == this.paytype) {
					//余额支付成功
					this.$u.toast(res.msg);
					this.$emit('successPay');
					this.close();
					return;
				}
				uni.requestPayment({
					provider: 'wxpay',
					timeStamp: res.data.timeStamp,
					nonceStr: res.data.nonceStr,
					package: res.data.package,
					signType: res.data.signType,
					paySign: res.data.paySign,
					success: rest => {
						this.$u.toast('支付成功！');
						this.$emit('successPay');
						this.close()
					},
					fail: err => {
						this.$u.toast('fail:' + JSON.stringify(err));
					}
				});
			},
			// #endif

		// #ifdef H5
			submit: async function() {
				let data = {
					id: this.source_id,
					type: this.type,
					paytype: this.paytype,
					method: 'wap',
					currency:this.is_money?'money':'score'
				};
				//在微信环境，且为微信支付
				if (this.isWeixin && this.paytype == 'wechat') {
					data.method = 'mp';
					let res = await this.$api.goOrderSubmit(data);
					if(res.data=='bind'){
						this.goToAuth();
						return;
					}
					if(!res.code){
						this.$u.toast(res.msg);
						return;
					 }					
					if ('balance' == this.paytype) {
						//余额支付成功
						this.$u.toast(res.msg);
						this.$emit('successPay');
						this.close();
						return;
					}
					window.WeixinJSBridge.invoke(
						'getBrandWCPayRequest',
						{
							appId: res.data.appId, // 公众号名称，由商户传入
							timeStamp: res.data.timeStamp, // 时间戳，自1970年以来的秒数
							nonceStr: res.data.nonceStr, // 随机串
							package: res.data.package,
							signType: res.data.signType, // 微信签名方式：
							paySign: res.data.paySign // 微信签名
						},
						rest => {
							if (rest.err_msg === 'get_brand_wcpay_request:ok') {
								this.$u.toast('支付成功！');
								this.$emit('successPay');
								this.close();
							} else if (rest.err_msg === 'get_brand_wcpay_request:cancel') {
								this.$u.toast('取消支付');
							} else {
								this.$u.toast('支付失败');
							}
						}
					);
				} else {
					//非微信环境的wap 支付方法，会返回orderid，再模拟表单提交
					data.returnurl = window.location.href;
					let res = await this.$api.goOrderSubmit(data);
					if(!res.code){
						this.$u.toast(res.msg);
						return;
					 }
					if ('balance' == this.paytype) {
						//余额支付成功
						this.$u.toast(res.msg);
						this.$emit('successPay');
						this.close();
						return;
					}

					//URL地址
					if(res.data.toString().match(/^((?:[a-z]+:)?\/\/)(.*)/i)){
						location.href = res.data;
						return;
					}

					//Form表单
					document.getElementsByTagName("body")[0].innerHTML = res.data;
					let form = document.querySelector("form");
					if(form && form.length>0){
						form.submit();
						return;
					}

					//Meta跳转
					let meta = document.querySelector('meta[http-equiv="refresh"]');
					if(meta && meta.length>0){
						setTimeout(function(){
							location.href = meta.content.split(/;/)[1];
						}, 300);
						return;
					}

				}
			}
			// #endif

		// #ifdef APP-PLUS
			submit: async function() {
			let appid = plus.runtime.appid;
			let res = await this.$api.goOrderSubmit({
				id: this.source_id,
				type: this.type,
				paytype: this.paytype,
				method: 'app',
				appid:appid,
				currency:this.is_money?'money':'score'
			});
			if(!res.code){
				this.$u.toast(res.msg);
				return;
			 }
			if ('balance' == this.paytype) {
				//余额支付成功
				this.$u.toast(res.msg);
				this.$emit('successPay');
				this.close();
				return;
			}
			uni.requestPayment({
			    provider: this.paytype=='alipay'?'alipay':'wxpay',
			    orderInfo: res.data, //微信、支付宝订单数据
			    success: function (res) {
			        this.$u.toast('支付成功！');
			        this.$emit('successPay');
			        this.close()
			    },
			    fail: function (err) {
			        console.log('fail:' + JSON.stringify(err));
			    }
			});
		}
		// #endif

		// #ifdef MP-BAIDU
			submit: async function() {
				let res = await this.$api.goOrderSubmit({
					id: this.source_id,
					type: this.type,
					paytype: this.paytype,
					method: 'miniapp',
					currency:this.is_money?'money':'score'
				});
				if(!res.code){
					this.$u.toast(res.msg);
					return;
				 }

				if ('balance' == this.paytype) {
					//余额支付成功
					this.$u.toast(res.msg);
					this.$emit('successPay');
					this.close();
					return;
				}

			},
		// #endif

		// #ifdef MP-ALIPAY
				submit: async function() {
					let res = await this.$api.goOrderSubmit({
						id: this.source_id,
						type: this.type,
						paytype: this.paytype,
						method: 'miniapp',
						currency:this.is_money?'money':'score'
					});
					if(!res.code){
						this.$u.toast(res.msg);
						return;
					 }

					if ('balance' == this.paytype) {
						//余额支付成功
						this.$u.toast(res.msg);
						this.$emit('successPay');
						this.close();
						return;
					}
					uni.requestPayment({
					    provider: 'alipay',
					    orderInfo: res.data, //微信、支付宝订单数据
					    success: function (res) {
					        this.$u.toast('支付成功！');
					       this.$emit('successPay');
					        this.close()
					    },
					    fail: function (err) {
					        console.log('fail:' + JSON.stringify(err));
					    }
					});
				},
				// #endif

	}
};
</script>

<style>
.sendMsg {
	width: 600rpx;
	height: 450rpx;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.group {
	width: 100%;
}
.pricelist {
	width: 33.3%;
}
</style>
